<template>
    <div class="tab">
        <span :class="{active:tabIndex==0}" @click="tabClick(0)">商品介绍</span>
        <span :class="{active:tabIndex==1}"  @click="tabClick(1)">商品评价</span>
    </div>
</template>
<script>
import {ref} from 'vue'
export default {
    props:['aa'],
    setup(props,{emit}) {
        console.log(props.aa);
        const tabIndex = ref(0)
        const tabClick = (index)=>{
                tabIndex.value = index
                emit('tabCut',index)
        }
        return {tabClick,tabIndex}
    }

}
</script>
<style lang="scss" scoped>
.tab{
    width:100%;
    height: 44px;
    line-height: 44px;
    background: #fff;
    margin-top: 10px;
    span{
        width:50%;
        display: inline-block;
        text-align: center;
        height: 100%;
        
    }
    .active{
        border-bottom:2px solid #c00;
    }
}
</style>
